<template>
  <form @submit.prevent="sendToParents">
    <input 
      v-model="message" 
      placeholder="在此输入信息"
    >
    <button>发送</button>
  </form>
</template>
<script>
  export default {
    data: function() {
      return{ message:'' }
    },
    mounted () {
        this.message={uname:'hh',roomid:'rom'}
      this.$socket.emit('join', this.message);  // 向服务器发送
    },
    methods: {
      sendToParents: function () {
        // this.$dispatch('send-box-msg', this.message);
        this.$socket.emit('chat message', this.message);  // 向服务器发送
        this.message = '';
      }
    },
  }
</script>
<style scoped>
  form {
    background: #000;
    padding: 3px;
    bottom: 0;
    width: 100%;
  }
  form input {
    border: 0;
    padding: 10px;
    width: 90%;
    margin-right: .5%;
  }
  form button {
    width: 9%;
    background: rgb(130, 224, 255);
    border: none;
    padding: 10px;
  }
</style>
